<template>
  <div class="order">
    <div class="headern">
      <div @click="goBack" style="float: left">
        <a-icon type="left" class="icon"/>
        <a class="h3">详情</a>
      </div>
    </div>
     <div class="bodyContent">
        <div class="infomain">
          <div v-html="this.$route.query.id">{{this.$route.query.id}}</div>
        </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'headern',
  data () {
    return {}
  },
  methods: {
    goBack () {
      this.$router.go(-1)
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '../../../static/css/color.styl';

.order {
  position: relative;
  background-color: $color-grayc;
  height: 100%;
}

.headern {
  height: 0.98rem;
  background-color: $color-main;
  text-align: justify;
  line-height: 0.98rem;
  padding-left: 0.3rem;
  color: $color-white;
  margin-bottom: 0.3rem;

  .icon {
    font-size: 0.36rem;
    color: $color-white;
    vertical-align: -0.06rem;
  }

  .h3 {
    display: inline-block;
    font-size: 0.36rem;
    color: $color-white;
  }

  .chargeback {
    height: 100%;
    float: right;
    line-height: 1rem;
    font-size: 0.32rem;
    margin-right: 0.4rem;

    .icon {
      width: 0.25rem;
      height: 0.3rem;
      background: url('../../../static/images/Order2/message1.png') no-repeat;
      background-size: 100%;
      margin-top: 0.37rem;
      margin-right: 0.15rem;
      float: left;
    }

    .span {
      color: $color-white;
      font-weight: normal;
    }

    .time {
      margin-left: 0.6rem;
      color: $color-orderone;
    }
  }
}

.anticon {
  font-size: 0.26rem;
  vertical-align: -0.23em;
}

.infomain {
  position: relative;
  height: 9.2rem;
  box-shadow: 3px 3.464px 12px 0px rgba(127, 135, 143, 0.2);
  padding: 0.5rem 0.3rem 0;
  overflow-y: auto;

}
</style>
